/** Add css rules here for your application. */


/** Example rules used by the template application (remove for your app) */
h1 {
  font-size: 2em;
  font-weight: bold;
  color: #777777;
  margin: 40px 0px 70px;
  text-align: center;
}

.voicepanel {
	width:45px;	
}
.microphone {
	text-align:center;
    font-size: 30px;
    width: 25px;
    height: 25px;
    cursor:pointer;
    border: none;
    margin-left: 10px;
    outline: none;
    background: transparent;
}
.micinput {
	font-size: 12px;
	font-style:italic;
	color:grey;
	width:45px;
	height:14px;
	border:none;
	margin:1px;
	outline:none;
	background: transparent;
}

.sendButton {
  display: block;
  font-size: 16pt;
}

.gwt-Grid { 
	width:1500px;
	height:750px;
	padding:0px;
	background-image:url('/images/MarsModuleLandingArea.jpg');
/* Uncomment this item for deployemnt on a website */
	/*background-image:url('/~cutsh020/war/images/MarsModuleLandingArea.jpg');*/
	background-repeat:no-repeat;
}
.gwt-Grid td {
	width:15px;
	height:15px;
	border: 1px solid DimGray;
  	padding: 0px;
}

td img {   
 	display: block 
}

/** Most GWT widgets already have a style name defined */
.gwt-DialogBox {
  width: 400px;
}
.repair {
	color: yellow;
}
.usable {
	color: green;
}
.broken {
	color: red;
}
.gwt-ListBox {
	color: green;
}

.dialogVPanel {
  margin: 5px;
}

/** Used for laying out the border around the main panel */

/* Style for entire main page */
.scrollpanel {
	width: 100%;
	height:100%;
}

.dockpanel { 
   overflow:hidden;
   position:absolute;
   width: 100%;
   height:auto;
   min-height:350px; 
   margin-left: auto;
   margin-right: auto;
   margin-top: 0px;
   text-align:center;
   background-color:#DCDCDC;
}

/* East and West panel styles */
.sidepanel {
	
	border: 2px ridge #BBBBBB;
	width:200px;
	height:750px;
	background-color:#FFFFFF;
	
}

/* Center split layout style */
.centerpanel {
	border: 2px ridge #BBBBBB;
	width:800px;
	height:750px;
	background-color:#FFFFFF;
}


.northpanel {
	/*border: 2px ridge #BBBBBB;
	background-color:#FFFFFF;*/
	width:100%;
	height:50px;
}

.southpanel {
	border: 2px ridge #BBBBBB;
	background-color:#FFFFFF;
	width:100%;
	height:100%;
}

/* Used for styling the controller panel */
.controlpanel {
	width:100%;
	height:100%;
	vertical-align:middle;
}

.weatherText{
	color: red;
	font-size:20pt;
}

.weatherpanel {
	width:100%;
	height:100px;
	background-image:url('/images/WundergroundLogo.jpg');
/* Uncomment this item for deployemnt on a website */
	/*background-image:url('/~cutsh020/war/images/WundergroundLogo.jpg');*/
	background-repeat:no-repeat;
	background-position: right bottom;
	background-color:blue;
}

.mappanel{
	width:100%;
	height:100%;
}

/* Used for laying out the stack panels */
/*.gwt-StackLayoutPanel 
  .gwt-StackLayoutPanelHeader 
    .gwt-StackLayoutPanelContent 
      .gwt-StackLayoutPanelItem */
.splitlayoutstyle {
	width:100%;
}
.splitlayoutstyle .gwt-StackLayoutPanelContent {
	border:1px solid black;
}
.splitlayoutstyle .gwt-StackLayoutPanelHeader{
	vertical-align:middle;
	cursor:pointer;
	border:0px hidden;
	width: 100%; 
    height:30px;
    
    font: 14px arial bold;
    font-weight: normal;
    color: aliceblue;
    
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    
	border:3px solid;
	border-style:outset;
	border-color:#A9A9A9; /*Dark grey */
	
	display: block;
    font-size: inherit;
       
    background-color: #333;
    -webkit-transition: all 0.05s linear;
    -o-transition: all 0.05s linear; 
    -moz-transition: all 0.05s linear;
    tratransition: all 0.05s linear;
}

/* Used for laying out the buttons in the controller panel at hover */
.splitlayoutstyle .gwt-StackLayoutPanelHeader:HOVER{
		color: orange;
        outline-color: orange;
}
/* Used for laying out the buttons in the controller panel at click */
.splitlayoutstyle .gwt-StackLayoutPanelHeader:ACTIVE {
		color: #333;
		background-color: orange;
		border-style: inset; 
}

/* Used for laying out the buttons in the controller panel */
.buttonstyle {
	border:0px hidden;
	width: 10em; 
    height:3.1em;
    
    font: 14px arial bold;
    font-weight: normal;
    color: aliceblue;
    
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    
	border:4px solid;
	border-style:outset;
	border-radius:10px;
	border-color:#A9A9A9; /*Dark grey */
	
	display: block;
    font-size: inherit;
       
    background-color: #333;
    -webkit-transition: all 0.05s linear;
    -o-transition: all 0.05s linear; 
    -moz-transition: all 0.05s linear;
    tratransition: all 0.05s linear;
}

/* Used for laying out the buttons in the controller panel at hover */
.buttonstyle:HOVER{
		color: orange;
        outline-color: orange;
}
/* Used for laying out the buttons in the controller panel at click */
.buttonstyle:ACTIVE {
		color: #333;
		background-color: orange;
		border-style: inset; 
}

.buttonerror {
		border:0px hidden;
	width: 10em; 
    height:3.1em;
    
    font: 14px arial bold;
    font-weight: bold;
    color: red;
    
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    
	border:4px solid;
	border-style:dotted;
	border-radius:10px;
	border-color:red; /*Dark grey */
	
	display: block;
    font-size: inherit;
       
    background-color: #333;
	
}

.buttonsuccess{
	border:4px solid;
	border-style:outset;
	border-radius:10px;
	border-color:green; /*Dark grey */
}

.buttondisabled{
		border:0px hidden;
	width: 10em; 
    height:3.1em;
    
    font: 14px arial bold;
    font-weight: normal;
    color: aliceblue;
    
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    
	border:4px solid;
	border-radius:10px;
	border-color:#333; /*Dark grey */
	display: block;
    font-size: inherit;
       
    background-color: #333;
    -webkit-transition: all 0.05s linear;
    -o-transition: all 0.05s linear; 
    -moz-transition: all 0.05s linear;
    tratransition: all 0.05s linear;
}

/** Customize the menu bar's look and feel. */
.menubar {}
.menutab {}
.menuitem {}
.gwt-MenuBar{
	width:100%;
	text-align: left;
}
.gwt-MenuItem {}
.gwt-MenuItem-selected {}

.serverResponseLabelError {
  color: red;
}

.popupwrapper {
	border:4px solid;
	border-style:outset;
	border-radius:6px;
	border-color:orange;
}

.errorpopupwrapper {
	border:4px solid;
	border-style:outset;
	border-radius:6px;
	border-color:red;
}

.popup {
	border: 2px solid;
	border-color: black;
	border-radius:3px;
	padding:10px;
	background-color:#FFFFFF;
}

.integerboxstyle {
	width: 100%;
	height: 15px;
	border: 1px solid black;
}

.integerboxerror {
	width: 100%;
	height: 15px;
	border: 1px;
	border-style:dotted solid;
	border-color: red;
    -moz-box-shadow:    0px 0px 4px 2px red;
    -webkit-box-shadow: 0px 0px 4px 2px red;
    box-shadow:         0px 0px 4px 2px red;
}

.integerboxsuccess {
	border:1px solid green;
}

.integerboxhint {
	color:grey;
	font-style:italic;
	text-align:center
}

/* Changes the style for the split layout dragger */
.splitlayout .gwt-SplitLayoutPanel-VDragger {
    cursor: row-resize;
    height:18px;
	background: -webkit-radial-gradient(black, silver, white); /* Safari */
	background: -o-radial-gradient(black, silver, white); /* For Opera 11.1 to 12.0 */
	background: -moz-radial-gradient(black, silver, white); /* For Firefox 3.6 to 15 */
	background: radial-gradient(black, silver, white); /* Standard syntax (must be last) */
}

.splitlayout .gwt-SplitLayoutPanel-VDragger:AFTER {
}

